import { useGetAllDisciplines } from "@/entities/discipline/model/useGetAllDisciplines"
import { useGetAllLessons } from "@/entities/lesson/model/useGetAllLessons"
import { useGetAllThemes } from "@/entities/theme/model/useGetAllThemes"
import { CreateDisciplineButton } from "@/features/create-discipline/ui/CreateDisciplineButton"
import UiCreateDiscipline from "@/features/create-discipline/ui/CreateDisciplineForm"
import UiRemoveDiscipline from "@/features/remove-discipline/ui/RemoveDisciplineButton"
import { CreateLessonButton } from "@/features/lesson/ui/CreateLessonButton"
import UiCreateLessonForm from "@/features/lesson/ui/UiCreateLessonForm"
import { CreateThemeButton } from "@/features/theme/ui/CreateThemeButton"
import { RemoveThemeButton } from "@/features/theme/ui/RemoveThemeButton"
import UiCreateTheme from "@/features/theme/ui/UiCreateTheme"
import { UiButton } from "@/shared/Uikit/UiButton"
import { UiSpinner } from "@/shared/Uikit/UiSpinner"
import UiTable from "@/shared/Uikit/UiTable"
import { UiFormPageLayout } from "@/shared/Uikit/layouts/UiFormPageLayout"
import { IDiscipline, ILesson, ITheme } from "@/shared/interfaces"
import { Modal, ModalBody, ModalContent, ModalHeader, useDisclosure } from "@nextui-org/react"
import Link from "next/link"
import { useEffect, useRef, useState } from "react"
import RemoveDisciplineButton from "@/features/remove-discipline/ui/RemoveDisciplineButton"
import { keysIn, last } from "lodash"
import { Tajawal } from "next/font/google"
import EditLessonButton from "@/features/editLesson/ui/editLessonButton"


export default function EducationalProgramTable() {
    const { isOpen, onOpen, onOpenChange } = useDisclosure();
    const getDisciplines = useGetAllDisciplines()
    const getThemes = useGetAllThemes()
    const getLessons = useGetAllLessons()
    const disciplines = getDisciplines.disciplines || []
    const themes = getThemes.themes || []
    const lessons = getLessons.lessons || []
    const isSuccess = getDisciplines.isSuccess && getThemes.isSuccess && getLessons.isSuccess
    const isLoading = getDisciplines.isLoading && getThemes.isLoading && getLessons.isLoading

    const [config, setConfig] = useState<{
        func: 'lesson',
        themeId: number
    } |
    {
        func: 'discipline',
    } |
    {
        func: 'theme',
        disciplineId: number
    }>()

    const refetch = () => {
        getDisciplines.refetch()
        getLessons.refetch()
        getThemes.refetch()
    }

    const getLevels = (count: number) => {
        const array: number[] = []
        for (let i = 1; i <= count; i++) {
            array.push(i)
        }
        return array
    }
    const levels = getLevels(40)


    return (
        <>
            {isLoading && <UiSpinner className='size-10' />}
            {isSuccess &&
                <UiTable
                    columns={[{
                        key: 'level',
                        label: 'Уровень'
                    }, ...disciplines.map((discipline) => {
                        return {
                            key: discipline.id.toString(),
                            label:
                                <div>
                                    {discipline.tittle}
                                    <RemoveDisciplineButton
                                        disciplineId={discipline.id}
                                        onSuccess={refetch}
                                    />
                                </div>
                        }
                    }), {
                        key: 'button',
                        label: <CreateDisciplineButton
                            onSuccess={refetch}
                        />
                    }
                    ]}
                    data={levels.map((level) => {
                        return {
                            cells:
                                [{
                                    key: 'level',
                                    label: level
                                },
                                ...disciplines.map((discipline) => {
                                    return {
                                        key: discipline.id.toString(),
                                        label: <>
                                            {themes.filter((theme) =>
                                                (theme.disciplineId == discipline.id && theme.level == level))
                                                .map((theme) => {
                                                    return <div key={`theme${theme.id}`}>
                                                        {themeTable(theme, lessons, refetch)}
                                                    </div>
                                                })}
                                            <CreateThemeButton
                                                level={level}
                                                disciplineId={discipline.id}
                                                onSuccess={refetch}
                                            />
                                        </>
                                    }
                                })
                                ]
                        }

                    })}
                />
            }
        </>
    )
}



const themeTable = (theme: ITheme, lessons: ILesson[], refetch?: () => void) => {
    return (
        <>
            <UiTable
                columns={[{
                    key: 'theme',
                    label: <>
                        <p>Тема: {theme.tittle}</p>
                        <RemoveThemeButton themeId={theme.id} onSuccess={refetch} />
                        <CreateLessonButton themeId={theme.id} onSuccess={refetch} />
                    </>
                }]}
                data={lessons.filter((lesson) => (lesson.themeId == theme.id)).map((lesson) => {
                    return {
                        cells: [{
                            key: 'theme',
                            label: <>
                                <h1 className=' font-bold'>Урок</h1>
                                <p>Название:{lesson.tittle}</p>
                                <p>Награда:{lesson.award}</p>
                                <EditLessonButton lessonId={lesson.id} />
                            </>
                        }]
                    }
                })}
            />
        </>
    )
} 